Ext.ns('app.crud.blocks');

app.crud.blocks.canEdit = false;
app.crud.blocks.canPublish = false;
app.crud.blocks.canDelete = false;

Ext.define('app.crud.blocks.ListModel', {
    extend: 'Ext.data.Model',
    fields: [
     	{name:'id' , type:'integer'},
        {name:'title' , type:'string'},
        {name:'date_created', type:'date' , dateFormat:'Y-m-d H:i:s'},
        {name:'date_updated',type:'date' , dateFormat:'Y-m-d H:i:s'},
        {name:'author',type:'string' },
        {name:'updater',type:'string'},
        {name:'published' , type:'boolean'},
        {name:'published_version' , type:'integer'},
        {name:'last_version' , type:'integer'}
    ]
});
/**
 * Item edit window
 */
Ext.define('app.crud.blocks.Window',{
	   extend:'app.contentWindow',
	   textPanel:null,
	   constructor: function(config) {		
			config = Ext.apply({
		        title: 'Blocks :: Edit Item',
		        width: 720,
		        height:640,
		        objectName:'blocks',
		        controllerUrl:app.root
		    }, config);		
			
			this.callParent(arguments);
			
			this.textPanel = Ext.create('app.medialib.HtmlPanel',{
		    	title:'Text',
		    	editorName:'text'
			});
			
			this.contentTabs.getComponent(0).add([
				{
					fieldLabel:"Title",
					allowBlank:false,
					name:"title",
					anchor:'100%',
					xtype:"textfield"
				},{
					fieldLabel:"Show title?",
					name:"show_title",
					xtype:"checkbox",
					inputValue:1,
					submitValue:false
				}
			 ]);
				
			this.contentTabs.add(this.textPanel);
	   }
});

Ext.define('app.crud.blocks.Main',{
	  extend: 'Ext.Panel' ,
	  /**
	    * @var {Ext.grid.Panel}
	    */
	   dataGrid:null,
	   /**
	    * @var {Ext.data.Store}
	    */
	   dataStore:null,
	   /**
	    * @var {searchBar}
	    */
	   searchField: null,
	   /**
	    * @var {Ext.Button}
	    */
	   addItemBtn: null,
	   
	   constructor: function(config) {			
			config = Ext.apply({
				layout:'fit'
		    }, config);		
		   this.callParent(arguments);	
	   },
	   initComponent:function(){
		   
		   this.dataStore = Ext.create('Ext.data.Store', {
			    model: 'app.crud.blocks.ListModel',
			    proxy: {
			        type: 'ajax',
			    	url:app.root +  'list',
			        reader: {
			            type: 'json',
			            root: 'data',
			            totalProperty: 'count',
			            idProperty: 'id'
			        },
			        startParam:'pager[start]',
			        limitParam:'pager[limit]',
			        sortParam:'pager[sort]',
			        directionParam:'pager[dir]',
				    simpleSortMode: true
			    },
			    pageSize: 50,
		        remoteSort: true,
			    autoLoad: true,
			    sorters: [{
	                  property : 'date_updated',
	                  direction: 'DESC'
	            }]
			});
		   
		    this.searchField =  new SearchPanel({store:this.dataStore,local:false});
	
			this.addItemBtn = new Ext.Button({
				 text:'Add Item',
				 hidden:(!app.crud.blocks.canEdit)
			});
			
			this.addItemBtn.on('click' , function(){
				 this.showPageEdit(0);
			} , this);
			
			
			this.dataGrid = Ext.create('Ext.grid.Panel',{
					store: this.dataStore,
					viewConfig:{
				 		stripeRows:false
				 	},
		            frame: false,
		            loadMask:true,
				    columnLines: true,
				    autoscroll:true,
				    tbar:[this.addItemBtn ,'-', '->'  , this.searchField],
				    columns: [
							{
								id: 'published',
							    sortable: true,
							    text: 'Status',
							    dataIndex: 'published',
							    width:50,
							    align:'center',
							    renderer:app.publishRenderer 
							}, {
								text:'Versions Published / Last',
								dataIndex:'id',
								align:'center',
								width:150,
					        	renderer:app.versionRenderer
				             },{
								id: 'title',
							    sortable: true,
							    text: 'Title',
							    dataIndex: 'title',
							    flex:1
							},{
								text:'Created by',
					        	dataIndex:'date',
					        	sortable: true,
					        	width:210,
					        	renderer:app.creatorRenderer
					          },{
					        	text:'Updated By',
					        	dataIndex:'update_date',
					        	sortable: true,
						        width:210,
						        renderer:app.updaterRenderer
					          }
				    ],
				    bbar: Ext.create('Ext.PagingToolbar', {
			            store: this.dataStore,
			            displayInfo: true,
			            displayMsg: 'Displaying records {0} - {1} of {2}',
			            emptyMsg: "No records to display"
			        }),
			        listeners : {
				    	'itemdblclick':{
				    		fn:function(view , record , number , event , options){
				    			 this.showPageEdit(record.get('id'));
				    		},
				    		scope:this
				    	}
					}
			});			
			this.items=[this.dataGrid];
			this.callParent(arguments);
	   },
	   /**
	    * Show item edit window
	    * @param integer id
	    */
	   showPageEdit: function(id){
			var win = Ext.create('app.crud.blocks.Window',{
				dataItemId:id,
				canDelete:app.crud.blocks.canDelete,
				canEdit:app.crud.blocks.canEdit,
				canPublish:app.crud.blocks.canPublish
			});
			win.on('dataSaved' , function(){this.dataStore.load();}, this);		
			win.show();
			
			if(id){
				win.loadData(id , false);
			}	
	  }
});

Ext.onReady(function(){ 
	Ext.QuickTips.init();
	app.crud.blocks.canEdit = canEdit;
	app.crud.blocks.canPublish = canPublish;
	app.crud.blocks.canDelete = canDelete
	var dataPanel = Ext.create('app.crud.blocks.Main',{
		title:'Blocks :: Home'
	});
	app.content.add(dataPanel);
});